<template>
  <div class='section_jyff'>
    <!-- 标题 -->
    <div class="section_jyff_title">
      <div>
        <span :class="jyffInfo.jyfw ? 'section_title_point_blue': 'section_title_point_gary'">&nbsp;</span>
        <span>需要煎药服务</span>
      </div>
      <div></div> <!-- 备用 -->
      <div>
        <span>
          <mt-switch v-model="jyffInfo.jyfw" @change="setMedicjgf"></mt-switch>
        </span>
      </div>
    </div>


    <!-- 横线 -->
    <div class="section_jyff_line" v-show="jyffInfo.jyfw">
      <div>
        <span></span>
      </div>
    </div>


    <!-- 内容 -->
    <div class="section_jyff_content" v-show="jyffInfo.jyfw">
      <div class="section_content_jyff_content">
        <div class="select2_jyff" style="">
          <p>
            <svg class="icon" style="" viewBox="0 0 1024 1024" width="20"
              height="20"
            ><defs><style type="text/css"></style></defs><path d="M512 960.1c-118.1 0-229.3-16.5-313.1-46.4C111.9 882.6 64 839.9 64 793.6c0-33.7 25.3-65.7 73.2-92.6 44.4-24.9 106.7-44.9 180.2-57.8 5.4-1 10.6 2.7 11.6 8.1s-2.7 10.6-8.1 11.6c-71.3 12.5-131.5 31.7-173.9 55.6-28.8 16.2-63 42.3-63 75.2 0 36.7 44.3 73.6 121.7 101.2 81.7 29.2 190.5 45.3 306.3 45.3 93.5 0 182.4-10.4 257.2-30.2 5.3-1.4 10.8 1.8 12.2 7.1 1.4 5.3-1.8 10.8-7.1 12.2-76.4 20.1-167.1 30.8-262.3 30.8z m383-80.5c-3.3 0-6.5-1.6-8.4-4.6-3-4.6-1.6-10.8 3-13.8 23-14.8 50.4-38.5 50.4-67.6 0-33.2-35-59.6-64.3-75.9-43.3-24-104.5-43.2-177-55.6-5.4-0.9-9.1-6.1-8.2-11.5 0.9-5.4 6.1-9.1 11.5-8.2 74.7 12.7 138.1 32.7 183.3 57.8 48.8 27.1 74.6 59.4 74.6 93.3 0 30.2-20.6 59.4-59.6 84.4-1.6 1.1-3.5 1.7-5.3 1.7z" p-id="7152"></path><path d="M839 894.1m-16 0a16 16 0 1 0 32 0 16 16 0 1 0-32 0Z" p-id="7153"></path><path d="M512 838.1c-43.6 0-84.7-3.6-115.7-10.2-37.5-7.9-55-18.7-55-33.8 0-18.3 27.5-26.5 36.5-29.2 19.5-5.8 46.2-10.2 77.3-12.7 5.5-0.4 10.3 3.7 10.8 9.2 0.4 5.5-3.7 10.3-9.2 10.8-27.1 2.1-50.8 5.8-68.5 10.6-18.6 5-24.6 9.6-26.4 11.4 2.9 3 14.4 9.6 44.3 15.4 29 5.5 66.6 8.6 105.9 8.6s76.9-3.1 105.9-8.6c30-5.7 41.5-12.4 44.4-15.4-2.2-2.2-9.6-7-27.7-11.7-18.6-4.9-43.3-8.5-71.4-10.5-5.5-0.4-9.7-5.2-9.3-10.7 0.4-5.5 5.2-9.7 10.7-9.3 32.2 2.3 59.9 6.7 80.3 12.6 25.5 7.4 37.9 17.1 37.9 29.6 0 15.1-17.5 25.9-55 33.8-31.1 6.4-72.2 10.1-115.8 10.1z m150.9-43.2z" p-id="7154"></path><path d="M511.9 801c-1.5 0-3-0.3-4.4-1-3.2-1.6-79.1-39.4-156.3-109.7-45.5-41.4-81.7-85.5-107.8-131-32.8-57.3-49.4-117-49.4-177.4-0.1-76.4 27.4-150.3 77.5-208.1 3.6-4.2 9.9-4.6 14.1-1 4.2 3.6 4.6 9.9 1 14.1-46.9 54.1-72.7 123.3-72.6 194.9 0 129.2 82 231 150.7 293.6 64.7 58.9 129.9 95.1 147.3 104.3 17.3-9.2 82.9-45.6 147.6-104.6C728.2 612.5 810 510.9 810 381.8c0-164.3-133.7-298-298-298h-0.4c-47.3 0-94.4 11.5-136.4 33.2-4.9 2.5-10.9 0.6-13.5-4.3-2.5-4.9-0.6-10.9 4.3-13.5 44.8-23.2 95.1-35.4 145.5-35.4h0.5c84.9 0 164.8 33.1 224.8 93.1 60.1 60.1 93.1 139.9 93.1 224.8 0 60.4-16.6 120.1-49.4 177.4-26.1 45.5-62.3 89.6-107.8 131-77.3 70.5-153.2 108.3-156.4 109.9-1.4 0.7-2.9 1-4.4 1z" p-id="7155"></path><path d="M512 505.2c-70.1 0-127.1-57-127.1-127.1S441.9 251 512 251s127.1 57 127.1 127.1-57 127.1-127.1 127.1z m0-234.3c-59.1 0-107.1 48.1-107.1 107.1s48 107.2 107.1 107.2c59.1 0 107.1-48.1 107.1-107.1s-48-107.2-107.1-107.2z" p-id="7156"></path><path d="M318 140.1m-16 0a16 16 0 1 0 32 0 16 16 0 1 0-32 0Z" p-id="7157"></path></svg>
          </p>
          <p>
            <span>
              <span>剂数：</span><span>{{preinfostr.QTY}}</span>
            </span>
            <span>
              <span>煎药单价：</span><span>{{jyffInfo.jydj}}</span>
            </span>
            <span>
              <span>小计：</span><span>{{jyxj}}</span>
            </span>
          </p>
        </div>
      </div>
    </div>
  </div>

</template>

<script>
export default {

  props: { preinfostr: {
    type: Object,
  }},

  data() {
    return {
      jyffInfo: {
        jyfw: false,
        jydj: 1, // 煎药单价
        cfjs: 8,    // 处方剂数
        serverType: 'jy'
      },
    };
  },

  created() {
    //this.jyffInfo.cfjs = this.preinfostr.QTY;
  },

  components: {
  },

  computed: {
    jyxj() {
     return this.decimal(this.jyffInfo.jydj, 0) * this.decimal(this.preinfostr.QTY, 0) ; /*   jyffInfo.cfjs */
    },
  },

  methods: {
    setMedicjgf() {
      console.log('jgf1 ==============' + this.jyffInfo.jyfw);
      if (this.jyffInfo.jyfw) {
        this.jyffInfo.jyxj = this.jyxj;
      } else {
        this.jyffInfo.jyxj = 0;
      }
      this.jyffInfo.cfjs = this.preinfostr.QTY;
      console.log('jgf1.server ==============' + this.jyffInfo.serverType);
      this.$emit('setMedicjgf', String(JSON.stringify(this.jyffInfo)));
    },

    /**
     * 格式化数值
     * @num 要处理的数字
     * @v 要保留的小数位数
     */ 
    decimal(num, v) {
      var vv = Math.pow(10, v);
      return Math.round(num*vv)/vv;
    },

  },

  mounted() {
  },

};
</script>

<style socped>
.section_jyff_title{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.section_jyff_title div{
  display: inline-flex;
  align-items: center;
}
.section_jyff_title div:first-child span:first-child{
  /* background: #26a2ff; */
  margin-right: .3rem;
  height: 50%;
}
.section_title_point_blue {
  background: #26a2ff;
}
.section_title_point_gary {
  background: #e0e0e0;
}


.section_jyff_line div:first-child span:first-child{
  display: block;
  border: 0.01rem solid #f1f1f1;
  margin: .5rem 0;
}


/* GLOBAL */
.section_jyff{
  border-radius: 10px;
  width: 95%;
  margin: auto;
/*   -webkit-box-shadow:0px 3px 3px #c8c8c8 ;
  -moz-box-shadow:0px 3px 3px #c8c8c8 ;
  box-shadow:0px 3px 3px #c8c8c8 ;
 */
}


/* CONTENT */
.section_jyff_content div:first-child{
  display: flex;
  flex-flow: row;
  justify-content: flex-start;
  /* align-items: center; */
  font-size: 0.8rem;
  /* border-bottom: .5px solid #eaeaea; */
  padding: 0;
  width: 100%;
}
.section_jyff_content div:first-child p{
  display: inline-block;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
}
.section_jyff_content div:first-child p:nth-child(2) span{
/*   width: 5rem;
  line-height: 1.5rem;
  text-align: center; */
  display: inline-flex;
  flex-direction: row;
  align-content: flex-start;
  align-items: center;
  width:100%;
}
.select {
  display: inline-block;
  text-align: center;
  margin: .5rem 0;
}
.select2_jyff {
  display: flex;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  font-size: 0.8rem;
}
.select2_jyff p{
/*   display: flex;
  flex-flow: row;
  justify-content: flex-start; */
  /* align-items: center; */
/*   font-size: 0.8rem;
  line-height: 1rem; */
  /* padding-top: 0.5rem; */
}
.select2_jyff p:nth-child(1){
  margin-right: 1rem;
}
.select2_jyff p:nth-child(2){
  display: inline-flex;
  flex-flow: column;
  justify-content: flex-start;
  width:100%;
}
.select2_jyff p:nth-child(2) span{
  line-height: 1.2rem;
}
.section_jyff_content div:first-child p:nth-child(2) span span:nth-child(2) {
  display: inline-block;
  text-align: right;
  padding-right: .5rem;
}

.section_content_jyff_content {
  display: inline-flex;
  flex-direction: column;
}
</style>
